import React from 'react'
import { connect } from 'dva'
import { Card,Table } from 'antd'




/**
 * StockTopBad 前5大主要拖累
 */
import TableList from '../../../components/TableList'
class StockTopBad extends React.Component {
    state = {
        data: this.props.stockTopBad,
    }
    componentDidMount() {
        this.fetchData(this.props)
    }
    componentWillReceiveProps(nextProps) {

        if ((nextProps.lPortId !== this.props.lPortId) || (nextProps.timeRange !== this.props.timeRange)) {
            this.fetchData(nextProps)
        }
        if (nextProps.stockTopBad !== this.props.stockTopBad) {
            this.setState({
                data: nextProps.stockTopBad,
            })
        }
    }
    fetchData = (props) => {
        props.dispatch({
            type: 'combinatorialAnalysis/getStockTopBad',
            payload: props
        })
    }
    render() {
        const { fieldList, list } = this.state.data
        // 表格数据设置
        const dataSource = list

        // 表头设置
        const columns = []
        fieldList && fieldList.map(item => {
            if ((item.name.indexOf('权重') > -1)||(item.name.indexOf('占比') > -1)) {
                columns.push({
                    title: item.name,
                    dataIndex: item.id,
                    key: item.id,
                    render: (text, record) => (
                        <div className={`progress ${text>0?'':'minus'}`}>
                            <progress value={text>0?text.multiplyBy100():text.multiplyBy100()*-1} max="100"></progress><span>{text.multiplyBy100()}%</span>
                        </div>
                    )
                })
            }else {
                columns.push({
                    title: item.name,
                    dataIndex: item.id,
                    key: item.id,
                    render: (text, record) => text || (text === 0 ? 0 : '-')
                })
            }

        })
        return (
            <Card title='前5大主要拖累' >
                <Table columns={columns} dataSource={dataSource} rowKey="id" pagination={false} loading={!fieldList} />
            </Card>

        )
    }
}

StockTopBad.defaultProps = {
    lPortId: null,
    cBenchCode: null,
    timeRange: null,
    stockTopBad: {
        // "fieldList": [{
        //     "id": "code",
        //     "name": "股票代码"
        // },
        // {
        //     "id": "name",
        //     "name": "股票简称"
        // },
        // {
        //     "id": "days",
        //     "name": "持仓天数"
        // },
        // {
        //     "id": "weight",
        //     "name": "平均持股权重"
        // },
        // {
        //     "id": "ratio",
        //     "name": "收益贡献占比"
        // }],
        // "list": [{
        //     "id":"1",
        //     "code": "600000-CN",
        //     "name": "浦发银行",
        //     "days": 270,
        //     "weight": 0.1178,
        //     "ratio": 6.33
        // }]
    }
}

export default connect()(StockTopBad)
